<script type="text/javascript">
$(document).ready(function(){
	$("#productos").attr("disabled", true);
	$("#medida").change(function(){ getProductos(); });
	$("#addIngred").click(function(){ agregarProducto(); });
});

function getProductos()
{
	var code = $("#medida").val();
	$.get("<?php echo url_for('@__productos')?>", { id: code },
		function(resultado)
		{
			if(resultado == false){
				alert("Error");
			} else {
				$("#productos").attr("disabled",false);
				document.getElementById("productos").options.length=1;
				$('#productos').append(resultado);			
			}
		}
	);
}

function agregarProducto(){
	var nombre = $("#cantidad").val()+" "+$("#medida option:selected").text()+" "+$("#productos option:selected").text();
	var opcion = new Option(nombre, $("#productos").val());
	$('#ingredientes').append(opcion);
}
</script>

<?php echo form_tag('@plato_insert') ?>
	Nombre: <input type="text" id="nombre" name="nombre"></input>
	Receta de preparacion: <textarea name="preparacion" id="preparacion"></textarea>
	Tipo de medida: <select id="medida" name="medida">
	<option value="0">Selecciona Uno...</option>
	<?php
		$query = Doctrine::getTable('UNIDAD_MEDIDA')->getUnidades()->execute();
		foreach( $query as $obj)
			echo '<option value="'.$obj->id.'">'.$obj->nombre.'</option>';
	?>	
	</select>

	Elija un producto:<select id="productos" name="productos"><option value="0">Selecciona Uno...</option></select>
	Ingrese la cantidad: <input type="text" id="cantidad"></input>
	<a href="#" id="addIngred">Agregar Ingrediente</a>
	<select id = "ingredientes" width="200" eight="200" multiple>
	</select>
	<input type="submit" id="guardar" value="Guardar Receta"></input>
</form>
